/* 页面过渡动画 */
/* 在页面上使用 transform 会导致页面内的 fixed 定位渲染为 absolute，需要在动画完成后移除 */
/* base、before、after有顺序要求，不要变更排序 */

/* #ifdef H5 */
uni-page {opacity:0; position:relative;}
uni-page.animation-show{opacity:1;}
	/* 默认 */
uni-page.animation-base{top:0}
uni-page.animation-before{top:10px;}
uni-page.animation-after{top:0}
uni-page.animation-in{transition: top .3s, opacity .25s;}
uni-page.animation-out{transition: top .3s, opacity .25s;}
	/* 右侧进入 */
uni-page.animation-right-base{transform:translateX(0px);}
uni-page.animation-right-before{transform:translateX(30px);}
uni-page.animation-right-after{transform:translateX(0px);}
uni-page.animation-right-in{transition: transform .3s, opacity .3s;}
uni-page.animation-right-out{transition: transform .3s, opacity .3s;}
	/* 左侧进入 */
uni-page.animation-left-base{transform:translateX(0px);}
uni-page.animation-left-before{transform:translateX(-30px);}
uni-page.animation-left-after{transform:translateX(0px);}
uni-page.animation-left-in{transition: transform .3s, opacity .3s;}
uni-page.animation-left-out{transition: transform .3s, opacity .3s;}
	/* 上侧进入 */
uni-page.animation-top-base{transform:translateY(0px);}
uni-page.animation-top-before{transform:translateY(-30px);}
uni-page.animation-top-after{transform:translateY(0px);}
uni-page.animation-top-in{transition: transform .3s, opacity .3s;}
uni-page.animation-top-out{transition: transform .3s, opacity .3s;}
	/* 下侧进入 */
uni-page.animation-bottom-base{transform:translateY(0px);}
uni-page.animation-bottom-before{transform:translateY(30px);}
uni-page.animation-bottom-after{transform:translateY(0px);}
uni-page.animation-bottom-in{transition: transform .3s, opacity .3s;}
uni-page.animation-bottom-out{transition: transform .3s, opacity .3s;}
	/* 旋转进入 */
uni-page.animation-rotate-base{transform:rotate(0);}
uni-page.animation-rotate-before{transform:rotate(360deg);}
uni-page.animation-rotate-after{transform:rotate(0);}
uni-page.animation-rotate-in{transition: transform .3s, opacity .3s;}
uni-page.animation-rotate-out{transition: transform .3s, opacity .3s;}
	/* 缩放进入 */
uni-page.animation-zoom-base{transform:scale(1);}
uni-page.animation-zoom-before{transform:scale(1.2);}
uni-page.animation-zoom-after{transform:scale(1);}
uni-page.animation-zoom-in{transition: transform .3s, opacity .3s;}
uni-page.animation-zoom-out{transition: transform .3s, opacity .3s;}
	/* 变形进入 */
uni-page.animation-skew-base{transform:skew(0,0);}
uni-page.animation-skew-before{transform:skew(45deg,45deg);}
uni-page.animation-skew-after{transform:skew(0,0);}
uni-page.animation-skew-in{transition: transform .3s, opacity .3s;}
uni-page.animation-skew-out{transition: transform .3s, opacity .3s;}
	/* 3D进入 */
uni-page.animation-3d-base{transform:perspective(0) translateZ(0);}
uni-page.animation-3d-before{transform:perspective(100px) translateZ(-200px);}
uni-page.animation-3d-after{transform:perspective(0) translateZ(0);}
uni-page.animation-3d-in{transition: transform .3s, opacity .3s;}
uni-page.animation-3d-out{transition: transform .3s, opacity .3s;}
	/* 3D2进入 */
uni-page.animation-3d2-base{transform:translate3d(0, 0, 0);}
uni-page.animation-3d2-before{transform: translate3d(400px, -700px, -900px);}
uni-page.animation-3d2-after{transform:translate3d(0, 0, 0);}
uni-page.animation-3d2-in{transition: transform .3s, opacity .3s;}
uni-page.animation-3d2-out{transition: transform .3s, opacity .3s;}
/* #endif */